<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../../static/js/jquery-1.11.0.js"></script>
    <style>

        #d1 {
            width: 480px;
            height: 86vh;
            position: absolute;
            margin-top: 2vh;
            /*margin-left: 400px;*/
            right: 500px;
            background: rgba(255, 255, 255, 0.7);
            border-radius: 16px;
            text-align: center;
            /**/
            /*    内容超出时，打开滚动条*/
            overflow: auto;
        }

        .h1 {
            margin-top: 10px;
        }

        .d1 {
            /*border: 1px solid red;*/
            width: 100%;
            /*!*    内容超出时，打开滚动条*!*/
            /*    overflow: auto;*/
            padding-top: 20px;

        }
        .d1>span{
            margin-left: -330px;
            font-size: 20px;
        }
        .prod {
            margin-top: 10px;
            width: 94%;
            margin-left: 3%;
            height: 100px;
            border: 1px solid gray;
            border-radius: 5px;
        }

        .prod > h2 {
            margin-top: 20px;
        }

        .b {
            width: 200px;
            height: 40px;
            border-radius: 5px;
            background-color: mediumseagreen;
            margin-top: 10px;
        }

    </style>
    <script>
        $(function (){
            //查询app信息
            var uid=$("#userid").text();
            //alert(uid)
            $.ajax({
                url:"/userServlet",
                type:"post",
                data:{action:"findUserByU_id",userid:uid},
                dataType:"json",
                success:function (d){
                    // console.log(d)
                    if(d.code==1){
                        $(".dv1").append("<div class=\"prod\"><h3 style=\"line-height:100px \">您当前账户余额为："+d.data.u_balance+"</h3></div>")
                    }else {
                        alert(d.msg);
                    }
                }
            })
            //查询银行卡信息
            $.ajax({
                url:"/userServlet",
                type:"post",
                data:{action:"findCardByUid",userid:uid},
                dataType:"json",
                success:function (d){
                    //console.log(d);
                    if(d.code==1){
                       for(var i=0;i<d.data.length;i++){
                           var p=d.data[i].c_check;//审核状态
                           var a=d.data[i].c_type;
                           //储蓄卡 已审核
                           if(p==1&&a==0){
                               //获取银行卡前四位和后四位
                               var begin=d.data[i].c_id.substring(0,4);
                               var end =d.data[i].c_id.substring(16,20)
                               $(".dv2").append("<div class=\"prod\"><h4 style=\"line-height: 40px\">"+d.data[i].c_account+"</h4><h4 style=\"line-height: 40px\">"+begin+"******"+end+" 余额："+d.data[i].c_balance.toFixed(2)+"  </h4></div>")
                           }
                           //已审核 信用卡
                           if(p==1&&a==1){
                               //获取银行卡前四位和后四位
                               var begin=d.data[i].c_id.substring(0,4);
                               var end =d.data[i].c_id.substring(16,20)
                               $(".dv3").append("<div class=\"prod\"><h4 style=\"line-height: 40px\">"+d.data[i].c_account+"</h4><h4 style=\"line-height: 40px\">"+begin+"******"+end+" 余额："+d.data[i].c_balance.toFixed(2)+"  </h4></div>")
                           }
                           //未审核 储蓄卡
                           if(p==0&&a==0){
                               $(".dv4").append("<div class=\"prod\"><h3 style=\"line-height:100px \">"+d.data[i].c_account+"  银行预留手机号:"+d.data[i].c_phone+"</h3></div>")
                           }
                           //未审核 信用卡
                           if(p==0&&a==1){
                               $(".dv5").append("<div class=\"prod\"><h3 style=\"line-height:100px \">"+d.data[i].c_account+"  银行预留手机号:"+d.data[i].c_phone+"</h3></div>")
                           }
                       }
                    }else {
                        alert(d.msg);
                    }
                }
            })
        })
    </script>
</head>
<body>
<!--主体部分-->
<div id="d1">
    <h1 class="h1">个人中心</h1>
    <div class="d1">
        <div class="dv1">
<!--            app账户-->
            <span style="margin-left: -300px">资产总值:</span>
<!--            <div class="prod"><h3 style="line-height:100px ">您当前账户余额为：$7777.00</h3></div>-->
        </div>
<!--        已审核储蓄卡-->
        <div class="dv2" style="margin-top: 20px">
            <span style="margin-left: -300px">储蓄卡:&nbsp;</span>
<!--            <div class="prod"><h4 style="line-height: 40px">中国银行  </h4><h4 style="line-height: 40px">2222******4351 余额：$777.00  </h4></div>-->
        </div>
<!--        已审核信用卡-->
        <div class="dv3"style="margin-top: 20px">
            <span style="margin-left: -300px">信用卡:&nbsp;</span>
<!--            <div class="prod"></div>-->
        </div>
<!--        未审核储蓄卡-->
        <div class="dv4"style="margin-top: 20px">
            <span style="margin-left: -300px">待审核储蓄卡:&nbsp;</span>
<!--            <div class="prod"><div class="prod"><h3 style="line-height:100px ">中国银行  银行预留手机号:</h3></div></div>-->
        </div>
<!--        未审核信用卡-->
        <div class="dv5"style="margin-top: 20px">
            <span style="margin-left: -300px">待审核信用卡:&nbsp;</span>
<!--            <div class="prod"><div class="prod"><h3 style="line-height:100px ">中国银行  银行预留手机号:</h3></div></div>-->
        </div>
    </div>
</div>
</body>
</html>